<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <title>VAOI || Coleccion</title>
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport' />
    <link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <!-- Font Awesome Icons -->
    <link href="../css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <!-- Ionicons -->
    <link href="../css/ionicons.min.css" rel="stylesheet" type="text/css" />
    <!-- Theme style -->
    <link href="../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
    <!-- AdminLTE Skins -->
    <link href="../dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="../alertify.js/lib/alertify.js"></script>
    <link rel="stylesheet" href="../alertify.js/themes/alertify.core.css" />
    <link rel="stylesheet" href="../alertify.js/themes/alertify.default.css" />

    <script src="../plugins/jQuery/jQuery-2.1.3.min.js"></script>
    <script src="../javaScriptCreados/urlServicioRest.js" type="text/javascript"></script>
</head>

<body class="skin-green" onload="cargarColeccionesModificar();">
    <!-- Site wrapper -->

    <header class="main-header">
        <a class="logo"><b>VAOI</b></a>
        <!-- Header Navbar: style can be found in header.less -->
        <nav class="navbar navbar-static-top" role="navigation">
            <!-- Sidebar toggle button-->
            <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span>
            </a>
            <div class="navbar-custom-menu">
                <!-- User Account: style can be found in dropdown.less -->
                <ul class="nav navbar-nav">
                    <li class="dropdown user user-menu">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <img src="../dist/img/avatar5.png" class="user-image" alt="User Image" /> <span class="hidden-xs" id="usuario" title="#{usuariosView.usuario.codigoUsua}"></span>
                        </a>
                        <ul class="dropdown-menu">
                            <!-- User image -->
                            <li class="user-header"><img src="../dist/img/avatar5.png" class="img-circle" alt="User Image" />
                                <p id="Id-Rol"></p>
                                <p id="Id-Nombre"></p>
                            </li>

                            <!-- Menu Footer-->
                            <li class="user-footer">
                                <div class="pull-left">
                                    <a href="#" class="btn btn-default btn-flat">Menu</a>
                                </div>
                                <div class="pull-right">
                                    <a href="../login.html" class="btn btn-default btn-flat">Salir</a>
                                </div>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </nav>
    </header>

    <!-- =============================================== -->
    <!-- Left side column. contains the sidebar -->
    <aside class="main-sidebar">
        <!-- sidebar: style can be found in sidebar.less -->
        <section class="sidebar">

				<!-- sidebar menu: : style can be found in sidebar.less -->
				<ul class="sidebar-menu">

					<li class="header">Panel de Navegación</li>

                    <li><a 
                        onclick="reDireccionar('./articulo.html')">
                            <i class="fa fa-newspaper-o"></i> <span>Gestión Articulo</span>
                    </a></li>                    

					<li><a
						onclick="reDireccionar('./coleccion.html')">
							<i class="fa fa-folder-o"></i> <span>Gestión Colección</span>
					</a></li>

					<li><a
						onclick="reDireccionar('./rss.html')">
							<i class="fa fa-rss-square"></i> <span>Gestión RSS</span>
					</a></li>

					<li><a
						onclick="reDireccionar('./modificarDatos.html')">
							<i class="fa fa-cog" style="color: aqua;"></i> <span>Modificar Usuario</span>
					</a></li>

				</ul>
        </section>
        <!-- /.sidebar -->
    </aside>
		
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <div style="height: 100%">
        
        						<div class="panel panel-default">

							<div class="panel-heading" align="center"
								style="font-family: sans-serif; font-size: 150%;">Categorias</div>

							<div class="panel-body">

								<div align="left" >
								<div class="panel panel-default" style="height:200px; overflow: auto;">
								<div id="listaCategorias" class="list-group" >

								</div>
                                </div>

									<!--  <button onclick="crearArticulo();"
										class="btn btn-primary btn-block" type="button">Crear
										Articulo</button>-->

								</div>

							</div>

						</div>    
						
									<div class="panel panel-default">

							<div class="panel-heading" align="center"
								style="font-family: sans-serif; font-size: 150%;">Articulos</div>

							<div class="panel-body">

								<div align="left" >
								<div class="panel panel-default" style="height:200px; overflow: auto;">
								<div id="listaArticulos" class="list-group" >

								</div>
                                </div>
                                  <!-- 
									<div class="btn-group btn-group-justified">
										<a onclick="modificarArticulo();" class="btn btn-info">Modificar Articulo</a>
										
									    <a onclick="eliminarArticulo();" class="btn btn-danger">Eliminar Articulo</a>
                                    </div>-->

								</div>

							</div>

						</div>     
               

        </div>
    </div>
    
                   <!-- Dialogo Articulo -->
                <div class="modal fade" id="dlgArticulo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">

                                <h4 class="modal-title" align="center">Articulo</h4>
                            </div>
                            <div class="modal-body" id="panelModificar">

                                <label for="nombre">Nombre:</label>
                                <input id="nombre" type="text" class="form-control" placeholder="Nombre" readonly="readonly"/>
                                
                                <label for="descripcion">Descripción:</label>
                                <textarea  id="descripcion" class="form-control" placeholder="Descripcion" rows="2" readonly="readonly"></textarea>
                                
                                <label for="autor">Autor:</label>
                                <input id="autor" type="text" class="form-control" placeholder="Autor" readonly="readonly"/>
                                
                                <object id="pdf" type="application/pdf" data="" height="5px" width="100%"></object>                               
                                
                                <div align="center">
                                    <br/>                                    
                                    <button type="button" class="btn btn-info" onclick="verPdf();">Ver PDF</button>
                                    <button type="button" class=" btn btn-danger" onclick="$('#dlgArticulo').modal('hide');">Cerrar</button>
                                </div>

                            </div>

                        </div>
                    </div>
                </div>
            <!-- Fin Dialogo Articulo -->
      
		<footer class="main-footer">
			<div class="pull-right hidden-xs">
				<b>Version</b> 1.0
			</div>
			<strong>Copyright 2015-2016 <a
				href="http://almsaeedstudio.com">Almsaeed Studio</a>.
			</strong> All rights reserved.
		</footer>
	
	<!-- ./wrapper -->

    <!-- Bootstrap 3.3.2 JS -->
    <script src="../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
        <!-- AdminLTE App -->
    <script src="../dist/js/app.min.js" type="text/javascript"></script>

</body>
</html>
